'use client'
import { useState } from 'react'
import ChatInput from './ChatInput'
import Menu from './Menu'
import MessageList from './MessageList'
type Props = {
    counter: number
}
export default function Main({ counter }: Props) {
    const [counterNum, setCounter] = useState(counter)
    const [message, setMessage] = useState('')
    const handSend = async() => {
        const body = JSON.stringify({message}) // S
        const response:any = await fetch("/api/chat", {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json'
            },
            body
        })
        if(!response.ok){
           console.log(response.statusText)
           return 
        }
        const reader = response.body.getReader()
        const decoder = new TextDecoder()
        let done = false
        while(!done){
            const {value, done: doneReading} = await reader.read()
            done = doneReading
            const chunkValue = decoder.decode(value)
            console.log(chunkValue)
            setMessage(message + chunkValue)
        }

    }
    const handleAdd = () => {
        setCounter(counterNum + 1)
    }
    return (
        <main className="relative w-full h-full bg-white text-gray-900 dark:bg-gray-800 dark:text-gray-100">
            <Menu />
            主题内容
            <MessageList />
            <ChatInput />
        </main>
    )
}